<template>
    <div class="sider-page">
        <Menu style="width : 198px" theme="dark" accordion>
            <router-link to="/platform/dept">
                <MenuItem name="1">
                    <Icon type="ios-paper" />
                    部门
                </MenuItem>
            </router-link>

            <router-link to="/platform/user">
                <MenuItem name="2">
                    <Icon type="ios-paper" />
                    用户
                </MenuItem>
            </router-link>

            <MenuItem name="3">
                <Icon type="ios-paper" />
                角色
            </MenuItem>
            <MenuItem name="4">
                <Icon type="ios-paper" />
                菜单
            </MenuItem>
            <MenuItem name="5">
                <Icon type="ios-paper" />
                资源
            </MenuItem>
            <MenuItem name="6">
                <Icon type="ios-paper" />
                ThreeJs
            </MenuItem>
        </Menu>
    </div>
</template>
<script>
export default {

}
</script>

<style scoped>
.sider-page {
    position: fixed;
    width: 200px;
    height: 100%;
    border-right: solid 1px #141e2a;
    background-color: #000918;
}
/*
    样式重写
*/
.sider-page .ivu-menu-dark {
    background-color: #000918;
}
.sider-page .ivu-menu-item:hover {
    border-left: 3px solid #00aeff;
}
.sider-page .ivu-menu-item-selected {
    border-left: 3px solid #00aeff;
}
.sider-page .ivu-menu-item-active {
    font-size: 14px;
}

</style>